<template>
  <view v-if="showPage">
    <view v-if="isShowSearch" class="search" :class="{ center: isShowSearch === 1 }">
      <search-bar
        :isShowCategoryIcon="isShowCategoryIcon"
        :fixed="searchFixed"
        :showSearch="isShowSearch"
        :shortSearch="shortSearch"
      ></search-bar>
    </view>
    <view v-for="(fragment, index) in fragmentList" :key="index">
      <banner-swiper
        v-if="fragment.templateId == '1001'"
        :fragmentId="fragment.id"
        @upDataView="upDataView"
        :initializationParams="fragment.initializationParams"
        :moduleOrder="index + 1"
      ></banner-swiper>
      <fast-entry-b
        v-if="fragment.templateId == '1002'"
        :fragmentId="fragment.id"
        @upDataView="upDataView"
        :initializationParams="fragment.initializationParams"
        :moduleOrder="index + 1"
      ></fast-entry-b>
      <operation-zone
        v-if="fragment.templateId == '1003'"
        :fragmentId="fragment.id"
        :initializationParams="fragment.initializationParams"
        :moduleOrder="index + 1"
      ></operation-zone>
      <channel
        :isShowHeader="isShowHeader"
        class="channel_container"
        ref="channel"
        :definedEntrance="'other'"
        v-if="fragment.templateId == '1004'"
        :fragmentId="fragment.id"
        :initializationParams="fragment.initializationParams"
        :moduleOrder="index + 1"
      ></channel>
      <view
        class="interval"
        v-if="fragment.templateId == '1008'"
        :style="{ height: fragment.initializationParams + 'px' }"
      ></view>
      <text-area
        class="rich-text"
        v-if="fragment.templateId == '1007'"
        :initializationParams="fragment.initializationParams"
      ></text-area>
      <!-- <product v-if="fragment.templateId == '1006'" :fragmentId="fragment.fragmentId" :initializationParams="fragment.initializationParams"></product> -->
      <product
        ref="productView"
        v-if="fragment.templateId == '1006'"
        :initializationParams="fragment.initializationParams"
        :moduleOrder="index + 1"
      ></product>
      <seckill
        :fragmentLength="fragmentList.length"
        v-if="fragment.templateId == '1009'"
        :initializationParams="fragment.initializationParams"
        :moduleOrder="index + 1"
      ></seckill>
      <marketing-recommend
        v-if="fragment.templateId == '1020'"
        :fragmentId="fragment.id"
        :moduleOrder="1"
        :pageId="pageId"
        :initializationParams="fragment.initializationParams"
      >
      </marketing-recommend>
      <hot-area
        v-if="fragment.templateId == '1017'"
        :scrollTop="scrollTop"
        :fragmentId="fragment.id"
        :initializationParams="fragment.initializationParams"
        :moduleOrder="index + 1"
        @upDataView="upDataView"
      ></hot-area>
      <video-module
        v-if="fragment.templateId == '1018'"
        :initializationParams="fragment.initializationParams"
        :moduleOrder="index + 1"
      ></video-module>

      <my-course
        v-if="fragment.templateId == '1015'"
        :templateId="fragment.id"
        :params="fragment.initializationParams"
      ></my-course>
      <course-channel
        ref="courseChannelV"
        v-if="fragment.templateId == '1016'"
        :ifColumn="fragment.displayType == 2"
        :headerHeight="headerHeight"
        :params="fragment.initializationParams"
        :isShowLoding="index + 1 == fragmentList.length"
      ></course-channel>
    </view>
    <recommend-goods v-if="isShowRecommend && !removeMigu" ref="recommend"></recommend-goods>
    <btn-list ref="btnList"></btn-list>
  </view>
</template>

<script>
import marketingRecommend from '@/components/marketing-recommend.vue'
import hotArea from './hotArea'
import btnList from '@/components/userDefinedPage/btnList.vue'
import bannerSwiper from './bannerSwiper/bannerSwiper.vue'
import fastEntryB from './fastEntryB/fastEntryB.vue'
import operationZone from './operationZone/operationZone.vue'
import channel from './channel/channel.vue'
import product from './product/product.vue'
import textArea from './text/text.vue'
import myCourse from '@/components/userDefinedPage/course/myCourse'
import courseChannel from '@/components/userDefinedPage/course/courseChannel'
import seckill from '@/components/userDefinedPage/seckill/seckill.vue'
import videoModule from '@/components/userDefinedPage/videoModule/videoModule.vue'
import recommendGoods from '@/components/recommendGoods/list'
import searchBar from '../searchBar.vue'

export default {
  components: {
    searchBar,
    bannerSwiper,
    fastEntryB,
    operationZone,
    channel,
    product,
    textArea,
    seckill,
    btnList,
    hotArea,
    videoModule,
    myCourse,
    courseChannel,
    recommendGoods,
    marketingRecommend,
  },
  props: {
    pageId: {
      type: String,
      default: '1',
    },
    title: {
      type: String,
      default: '福建省创新博士站',
    },
    headerBarHeight: Number,
  },
  provide() {
    return {
      showBeginMinuteBtn: this.showBeginMinuteBtn, //获取秒杀即将开始距离顶部的高度
    }
  },
  data() {
    return {
      fragmentList: [],
      scrollTop: 0,
      isShowHeader: 1,
      searchFixed: false,
      isShowRecommend: false,
      isShowSearch: 0, //是否显示自定义搜索框
      isShowCategoryIcon: 0, // 是否显示分类图标
      newscrollTop: '', //秒杀即将开始距离顶部的高度
      beginMinuteBtnFlag: false, //秒杀即将开始显示状态
    }
  },
  computed: {
    showPage() {
      return this.$globalData.state.flag.loginReady
    },
    shortSearch() {
      const headerHeight = this.isShowHeader ? this.$globalData.state.headerHeight : 0
      return (this.isShowShare == 1) & !headerHeight
    },
    headerHeight() {
      return this.$globalData.state.headerHeight
    },
  },
  created() {
    this.loadData()
  },
  methods: {
    // 控制跳到即将开始图标显示
    newonShareAppMessage() {
      if (this.beginMinuteBtnFlag && this.scrollTop < this.newscrollTop) {
        this.$refs.btnList && this.$refs.btnList.setIsShowBeginMinute(true, this.newscrollTop)
      } else {
        this.$refs.btnList && this.$refs.btnList.setIsShowBeginMinute(false, 0)
      }
    },
    // 获取秒杀即将开始距离顶部的高度
    showBeginMinuteBtn(flag, e = 0) {
      this.beginMinuteBtnFlag = flag
      this.newscrollTop = e + this.scrollTop
      this.newonShareAppMessage()
    },
    loadData() {
      this.$request('platform/page/detail', { pageId: this.pageId, pageType: 2 }).then(
        (data) => {
          //测试
          // data.fragmentList[1].initializationParams = data.fragmentList[1].initializationParams.replace('http://d.migudm.cn/zhykt001iU7Fri','https://m.migudm.cn/spa/member/index.html')
          this.fragmentList = data.fragmentList
          this.$refs.btnList.setIsShowCart(data.isShowCart)
          this.$refs.btnList.setIsShowHistory(data.isShowHistory)
          this.isShowHeader = data.isShowHeader == 0 ? 0 : 1
          this.isShowShare = data.isShowShare == 0 ? 0 : 1
          this.isShowSearch = data.isShowSearch
          this.isShowCategoryIcon = data.isShowCategoryIcon
          this.isShowRecommend = data.isShowRecommend
          this.$emit('updateTitle', {
            title: data.pageName,
            isShowHeader: this.isShowHeader,
            isShowShare: this.isShowShare,
          })
          if (this.isShowSearch && data.fragmentList && data.fragmentList.length) {
            if ([1001, 1017].includes(data.fragmentList[0].templateId)) {
              this.searchFixed = true
            }
          }
          if (this.$globalData.state.entrance != 'mp-weixin') {
            //分享
            if (data.shareInfo) {
              let obj = {
                title: data.shareInfo.shareTitle,
                desc: data.shareInfo.shareText,
                linkUrl: 'package_page/index?pageId=' + this.pageId,
                imageUrl: data.shareInfo.shareIconUrl,
                targetId: data.shareInfo.shareResourceId,
                targetType: data.shareInfo.shareType,
              }
              this.$share.detailShare(obj)
            } else {
              let obj = {
                title: data.pageName,
                desc: '我发现一个不错的活动,快来看看有什么商品吧~',
                linkUrl: 'package_page/index?pageId=' + this.pageId,
                imageUrl: 'http://ss.migudm.cn/mgmall/shareImageTob.png',
              }
              this.$share.detailShare(obj)
            }
          }
          if (data.shareInfo) {
            data.shareInfo.linkUrl = 'package_activity/customize/index?pageId=' + this.pageId
            this.$emit('updateShareInfo', data.shareInfo)
          }
          //首页悬浮窗判断
          for (var i = 0; i < this.fragmentList.length; i++) {
            // this.fragmentList[i];
            // console.log(this.fragmentList[i].templateId);
            if (this.fragmentList[i].templateId == '1005') {
              this.activityInfo = JSON.parse(this.fragmentList[i].initializationParams)
              this.$refs.btnList.setGiftLayer(this.activityInfo, this.fragmentList[i].id)
              break
            }
          }
          this.$bus.$emit('exposureInit')
        },
        (res) => {
          if (res.resultCode == 3000 || res.resultCode == 3001) {
            const pages = getCurrentPages()
            setTimeout((res) => {
              if (pages.length == 1) {
                this.$routeUtils.reLaunch({
                  url: '/pages/index/index',
                })
              } else {
                uni.navigateBack()
              }
            }, 2000)
          }
        },
      )
    },
    reachBottom() {
      // 获取频道区数据
      if (this.isShowRecommend)
        return this.$refs.recommend && this.$refs.recommend.loadRecommendGoods()
      this.$refs.channel && this.$refs.channel[0] && this.$refs.channel[0].loadMore()
      try {
        this.$refs.productView[0].loadMore()
      } catch (e) {
        //TODO handle the exception
      }
    },
    pageScroll(Object) {
      this.newonShareAppMessage()
      // 获取频道区数据
      this.scrollTop = Object.scrollTop
      this.$refs.channel && this.$refs.channel[0] && this.$refs.channel[0].pageScroll(Object)
      this.$refs.btnList.watchBackTop(Object.scrollTop)
    },
    upDataView() {
      this.fragmentList = []
      this.loadData()
    },
  },
}
</script>

<style lang="scss" scoped>
@import '../../style/index.scss';
@import '../../style/base.scss';

.fl {
  float: left;
}
.fr {
  float: right;
}
</style>
